<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="IE=edge" http-equiv="X-UA-Compatible">
    <title>新增机器</title>
    <meta content="" name="keywords">
    <meta content="" name="description">
    <meta content="width=device-width, initial-scale=1" name="viewport">
    <!-- Set render engine for 360 browser -->
    <meta content="webkit" name="renderer">
    <!-- No Baidu Siteapp-->
    <meta content="no-siteapp" http-equiv="Cache-Control">
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" /> 
    <!-- Add to homescreen for Chrome on Android -->
    <meta content="yes" name="mobile-web-app-capable">
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/amazeui/css/amazeui.min.css">
</head>

<body>
    <header data-am-widget="header" class="am-header am-header-default">
        <div class="am-header-left am-header-nav">
            <a href="{:U('machine')}" class="">
                <i class="am-header-icon am-icon-angle-left am-text-default"></i>
                <span class="am-header-nav-title">
                &nbsp;
              </span>
            </a>
        </div>
        <h1 class="am-header-title">
         新增机器
      </h1>
    </header>
    <form class="am-form publicb" id="form-with-tooltip" method="post" action="__SELF__">
        <fieldset>
            <legend>请认真填写机器详情</legend>
            <div class="am-form-group">
                <label for="doc-ipt-email-1">机器码</label>
                <input type="number" class="{$info['jiqima']?'':'js-ajax-validate'}" id="doc-ipt-email-1" placeholder="输入机器码" minlength="5" required data-foolish-msg="机器码必须正确输入" name="jiqima" data-validate-async value="{$info['jiqima']?$info['jiqima']:''}" />
            </div>
            <div class="am-form-group">
                <label for="doc-ipt-email-1">所在位置</label>
                <iframe id="map" src='https://m.amap.com/picker/?keywords=小区,加油站,写字楼&key=608d75903d29ad471362f8c58c550daf' width="100%" height="400"></iframe>
                <div class='am-g'>
                    <div class='am-u-sm-12'>
                        <small class='am-text-danger' id='address'>~</small>
                    </div>
                </div>
                <input type='hidden' name='dizhibeizhu' value="{$info['dizhibeizhu']?$info['dizhibeizhu']:''}" />
                <input type='hidden' name='name' value="{$info['name']?$info['name']:''}" />
                <input type='hidden' name='location' value="{$info['location']?$info['location']:''}" />
                <input type='hidden' name='address' value="{$info['address']?$info['address']:''}" />
            </div>
            <p>
                <button type="submit" class="am-btn am-btn-danger am-btn-block am-disabled" id='submit'></button>
            </p>
        </fieldset>
    </form>
    <script type="text/javascript">
    var self = "__SELF__"
    var getSelf = self.replace('.html', '');
    var __dirname = "__PUBLIC__";
    </script>
    <script charset="utf-8" src="__ROOT__/dist/index.js"></script>
    <script type="text/javascript">
    (function() {
        var defVal = '请选择机器所在位置~';
        var submit = document.getElementById('submit');
        submit.innerHTML = defVal;
        document.getElementById('address').innerHTML = defVal;

        var iframe = document.getElementById('map').contentWindow;
        document.getElementById('map').onload = function() {
            iframe.postMessage('hello', 'https://m.amap.com/picker/');
        };
        window.addEventListener("message", function(e) {
            // alert('您选择了:' + e.data.name + ',' + e.data.location);
            document.getElementById('address').innerHTML = '['+e.data.name+']'+e.data.address;
            document.getElementsByName('name')[0].value = e.data.name;
            document.getElementsByName('dizhibeizhu')[0].value = e.data.name;
            document.getElementsByName('location')[0].value = e.data.location;
            document.getElementsByName('address')[0].value = e.data.address;
            var defaul = document.getElementById('address').innerHTML;
            if (defaul == defVal || defaul == '') {
                defaul.innerHTML = defVal;
            } else {
                removeClass(submit, 'am-disabled');
                submit.innerHTML = '提交';

            }
        }, false);

        function hasClass(obj, cls) {
            return obj.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'));
        }

        function removeClass(obj, cls) {
            if (hasClass(obj, cls)) {
                var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)');
                obj.className = obj.className.replace(reg, ' ');
            }
        }
    }())
    </script>
    <script type='text/javascript'>
    var mock = {
        log: function(result) {
            window.parent.setIFrameResult('log', result);
        }
    }
    console = mock;
    window.Konsole = {
        exec: function(code) {
            code = code || '';
            try {
                var result = window.eval(code);
                window.parent.setIFrameResult('result', result);
            } catch (e) {
                window.parent.setIFrameResult('error', e);
            }
        }
    }
    </script>
</body>

</html>
